<div data-controller="ui--popover">
  <div class="popover-trigger" data-ui--popover-target="trigger" data-action="click->ui--popover#toggle">
    <%= content_for(:popover_trigger) %>
  </div>

  <div class="popover-wrapper" data-ui--popover-target="wrapper">
    <div
      date-side="bottom"
      data-controller="ui--transition"
      data-ui--popover-target="content"
      data-align="center"
      data-state="closed"
      role="dialog"
      class="<%= tw("hidden z-50 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none #{content_for(:popover_content_class)}") %>"
      tabindex=" -1 ">
      <%= content_for(:popover_content) %>
    </div>
  </div>
</div>
